import { ref, watch } from "vue";
import { isString } from "@/utils/is";
import { useAppStoreWithOut } from "@/store/modules/app";

const appStore = useAppStoreWithOut();

export const useTitle = (newTitle?: string) => {
    const { t } = useI18n();
    const title = ref(
        newTitle ? `${appStore.getTitle} - ${t(newTitle as string)}` : appStore.getTitle
    );

    watch(
        title,
        (n, o) => {
            if (isString(n) && n !== o && document) {
                document.title = n;
            }
        },
        { immediate: true }
    );

    return title;
};
